<template>
  <div class="dy-main">
    <div class="dy-header">
      <x-header :left-options="{preventGoBack: true,backText: ''}" @on-click-back="back" @on-click-more="showMenus = true">资金冻结</x-header>
    </div>
    <div class="dy-body">
      <div v-if="success == '1'">
        <div class="img-box-success"></div>
        <div class="financial-buy-result">资金冻结成功<p style="color:#999;"></p></div>
      </div>
      <!-- <div v-else>
        <div class="img-box-failed"></div>
        <div class="financial-buy-result">转账失败!<p style="color:#999;">资金实时转入收款行，实际时间取决于收款行处理情况</p></div>
      </div> -->
      <div class="show-box">
          <!-- <p><span>转出卡号</span><span>{{requestData.cardNo}}</span></p>
          <p><span>收款人姓名</span><span>{{requestData.payeeName}}</span></p>
          <p><span>收款人账号</span><span>{{requestData.payeeNo}}</span></p> -->
          <p><span></span><span>{{requestData.tranAmt}}</span></p>
          <p><span></span><span>{{requestData.bankCode}}</span></p>
      </div>
      <flexbox>
          <!-- <flexbox-item><div class="financial-result-button" @click="goNext">返回首页</div></flexbox-item> -->
          <flexbox-item><div class="financial-result-button" @click="goBack">返回首页</div></flexbox-item>
          <flexbox-item><div class="financial-result-button" @click="goBack">处理下一条</div></flexbox-item>
      </flexbox>
    </div>
  </div>
</template>

<script>
/* eslint-disable camelcase */
export default {
  data () {
    return {
      requestData: {
        cardNo: '', // 转出卡号
        payeeName: '', // 收款人姓名
        payeeNo: '', // 收款人账号
        tranAmt: '', // 转账金额
        bankCode: '', // 收款人开户行
        bankBranch: '', // 网点名称
        routeFlag: '3', // 转账方式 1-本行转账，2-超级网银转账，3-二代支付转账
        tranMode: '1', // 到账模式
        mobile: '' // 接收短信号码
      },
      success: '1'
    }
  },
  methods: {
    goNext: function () {
      this.$router.push({name: 'BringForwardTranDetail'})
    },
    goBack: function () {
      this.$router.push({name: 'BringForwardInput'})
    },
    back () {
      this.$router.isBack = true
      this.$router ? this.$router.back() : window.history.back()
      // console.log(this.$router.isBack)
    },
    refreshTest: function () {
      let _this = this
      window.WebViewJavascriptBridge.callHandler('nativeRequest',
        JSON.stringify({'requstSource': 'internetRequest', 'url': 'mstep.do?act=business', 'params': {'method_Name': 'CI009004', 'user_Data': {'bringId': '45678677'}}}),
        function (response) {
          _this.success = response.data.status
          response = JSON.parse(response)
          if (response.status === 0 || response.status === '0') {
            _this.requestData = response.data.data[0]
          } else {
            console.log('fail')
          }
        }
      )
    }
  },
  created () {
    this.refreshTest()
  }
}
</script>

<style scoped lang='less'>
.dy-body{
  background: #fff;
}
.a, .b{
  width: 100px;
  text-align: center;
  background: lightcoral;
}
.img-box-success{
  width: 1.08rem;
  height: 1.08rem;
  margin-top: .8rem;
  margin-bottom: .52rem;
  margin-left: 50%;
  transform: translateX(-50%);
  background: url(../../assets/img/Financial/FinancialBuyResultSuccess.png) no-repeat left top;
  background-size: 100% 100%;
}
.img-box-failed{
  width: 1.08rem;
  height: 1.08rem;
  margin-top:.8rem;
  margin-bottom: .52rem;
  margin-left: 50%;
  transform: translateX(-50%);
  background: url(../../assets/img/Financial/zunxiang.png) no-repeat left top;
  background-size: 100% 100%;
}
.financial-buy-result{
  text-align: center;
  font-size: .28rem;
}
.financial-buy-result-detail{
  font-size:.28rem;
  margin:.68rem .3rem 1.12rem .3rem;
  padding: 0.26rem .3rem;
  border-radius: .28rem;
}
.financial-buy-result-detail>div{
  padding: .14rem 0;
}
.result-item-left{
  width:30%;
  float: left;
  color:rgba(153,153,153,1);
}
.result-item-right{
  display:inline-block;
  text-align: right;
  width:70%;
  color:rgba(51,51,51,1);
}
.financial-result-button{
  width: 3rem;
  height: .88rem;
  margin: .3rem auto 0;
  line-height: .88rem;
  font-size: .34rem;
  color: #FFF;
  text-align: center;
  background: #EC1B30;
  border-radius: 0.06rem;
}
.show-box{
  width: 6.9rem;
  background: #fafafa;
  margin: 1.22rem auto;
  border-radius: .2rem;
  &>p{
    line-height: .6rem;
    overflow: hidden;
    padding: 0 .26rem;
    span:first-child{
      float: left;
    }
    span:last-child{
      float: right;
    }
  }
}
</style>
